/*
 * @Author       : NaN 353362604@qq.com
 * @Date         : 2023-04-14 10:18:19
 * @LastEditTime : 2023-06-08 14:26:08
 * @LastEditors  : NaN 353362604@qq.com
 * @FilePath     : \AdminStration\src\Pages\Admin\Other\MapPage.jsx
 * @Description  :
 */

import './Sass/MapPage.scss'
import { useEffect, useRef } from 'react'
import { useLocation } from 'react-router-dom'
import { useRequest, useEventEmitter } from 'ahooks'
import { Http } from '../../../Common/Api'
import { Initialization, InitializationData } from '../../../Common/Mars3d/Initialization'

const MapPage = () => {
    const { search } = useLocation()
    const Mars3dBox = useRef()

    const { runAsync: getClientData } = useRequest(Http, { manual: true })
    const { runAsync: getScenesDetails } = useRequest(Http, { manual: true })
    const { run: getScenes } = useRequest(Http, {
        manual: true,
        onSuccess: res => Initialization(res, Mars3dBox, InitializationEvent),
    })
    const InitializationEvent = useEventEmitter()
    InitializationEvent.useSubscription(({ map, gra, uuid }) => {
        getScenesDetails({ url: `getScenesDetailsUuid`, path: [uuid] }).then(res => InitializationData(map, gra, res))
    })

    useEffect(() => {
        const urlArray = search.split(/\/|\?|&/)
        const [, tokenArr, uuidArr] = urlArray
        const [, Token] = tokenArr.split('=')
        const [, Uuid] = uuidArr.split('=')
        if (Token) {
            sessionStorage.setItem('TOKEN', decodeURIComponent(Token))
            getClientData({ url: 'getClientData' }).then(res => {
                localStorage.setItem('ClientData', JSON.stringify(res.clientData))
                getScenes({ url: `getScenesID`, path: [Uuid] })
            })
        }
    }, [getClientData, search, getScenes])

    return <div className="MapPage" ref={Mars3dBox} />
}

export default MapPage
